<style>
    .demo-drawer-profile{
        font-size: 14px;
    }
    .demo-drawer-profile .ivu-col{
        margin-bottom: 50px;
    }
</style>
<template>
	<div>
		<Modal v-model="modalShow" :closable='false' :mask-closable=false fullscreen>
			<p slot="header">订单详情</p>
			
			 <div class="demo-drawer-profile">
			    <Row>
                    <Col span="14">
                        	订单号：<span>{{formData.order_sn}}({{formData.pay_status_text}})</span>
                    </Col>
                    <Col span="12">
                        	车牌号：<span>{{formData.car_sn}}</span>
                    </Col>
                    <Col span="14">
                        	姓名：<span>{{formData.realname}}</span>
                    </Col>
                    <Col span="14">
                        	电话：<span>{{formData.username}}</span>
                    </Col>
                    
                    <Col span="14">
                        	车辆：<span><img :src="formData.car_sys_img" width="100px" height="100px" style="margin-right: 5px;"></span>
                    </Col>
                    
                    <Col span="14">
                        	车辆：<span>{{formData.car_brand_name}} {{formData.car_sys_name}} {{formData.car_type_name}}</span>
                    </Col>
                    
                    <Col span="14">
                        	取车：<span>{{formData.q_time}}({{formData.q_dot_name}})</span>
                    </Col>
                    
                     <Col span="14">
                        	还车：<span>{{formData.h_time}}({{formData.h_dot_name}})</span>
                    </Col>
                    
                     <Col span="14">
                        	保证金：<span>{{formData.b_price}}</span><span style="color: red;">(包含车辆保证金和违章保证金)</span>
                    </Col>
                    
                      <Col span="14">
                        	会员保证金余额：<span>{{formData.b_money}}</span><span style="color: red;">(已充值保证金)</span>
                    </Col>
                    
                    <Col span="14">
                        	<Collapse>
							        <Panel name="1">
							            	租金费用：{{zData.z_price}}元
							            <p slot="content" style="color: red;">基本费用</p>
							            <p slot="content">租期：<span style="float: right;">{{zData.day}}天{{zData.hour}}时</span></p>
							            <p slot="content">租金：<span>{{zData.d_price}}元/天+{{zData.h_price}}元/时</span><span style="float: right;">{{zData.d_price * zData.day+zData.h_price* zData.hour}}元</span></p>
							            <br/>
							             <p slot="content" style="color: red;">其他费用</p>
							             <p slot="content">不计免费：<span>{{zData.set_no_ded_price}}/天</span><span style="float: right;">{{zData.set_no_ded_price * zData.day}}元</span></p>
							              <p slot="content">司机费用：<span>{{zData.dri_d_price}}/天+{{zData.dri_h_price}}/时</span><span style="float: right;">{{zData.dri_d_price * zData.day+zData.dri_h_price*zData.hour}}元</span></p>
							              <p slot="content">送车上门：<span v-if="zData.dis_price ==0">0元/公里</span><span v-else>{{zData.dis_price/zData.distance}}元/公里</span><span style="float: right;">{{zData.dis_price}}元</span></p>
							              <p slot="content" style="color: red;">其他费用</p>
							              <p slot="content">优惠券：<span v-if="zData.coupon !=null" style="float: right;color: red;">-{{zData.coupon.price}}元</span><span v-else style="float: right;color: red;">无优惠券</span></p>
							        </Panel>
    						</Collapse>
                    </Col>
                    
                     <Col span="14">
                        	是否送车上门：<span>{{formData.is_dis_text}}</span>
                    </Col>
                    <Col span="14" v-if="formData.is_dis == 1">
                        	送车上门费用：<span>{{formData.dis_price}}元</span>
                    </Col>
                    <Col span="14" v-if="formData.is_dis == 1">
                        	送车上门地址：<span>{{formData.dis_address}}</span>
                    </Col>
                  
                </Row>
			 </div>
			 
			 <Modal width="1000" height="1000" v-model="hModal" title="还车" @on-ok="hcModalOk" @on-cancel="hcModalCancel">
		   <p slot="header">还车</p>
			<Row>
				 <Col span="14" style="margin-bottom: 30px;font-size: 15px;font-weight:normal">
                        	订单号：<span>{{hData.order_sn}}</span>   <div style="float: right;">网点：<span>{{hData.dot_name}}</span></div>
                </Col>
				<Col span="16">
				<Form ref="formData" :model="formData" label-position="left" :label-width="100">	
					<FormItem label="车辆外观无损坏">
						<i-switch v-model="hData.is_per" :true-value="1" :false-value="-1" />
					</FormItem>

					<FormItem label="车辆内部清洁无损坏">
						<i-switch v-model="hData.is_clean" :true-value="1" :false-value="-1" />
					</FormItem>

					<FormItem label="是否正常">
						<i-switch v-model="hData.is_nor" :true-value="1" :false-value="-1" />
					</FormItem>

				</Form>
				</Col>
			</Row>
			 </Modal>

			<div slot="footer">
				<Button type="text" @click="cancel">取消</Button>
				<Button type="primary" @click="hc(1)"  v-if="formData.order_status == 1 && formData.pay_status == 3 && formData.car_back_status ==1">还车</Button>
				<Button type="error" @click="hc(2)"  :loading='saveLoading' v-if="formData.order_status == 1 && formData.pay_status == 3 && formData.car_back_status ==1">结束订单 </Button>
				<Button type="error" @click="hc(2)"  :loading='saveLoading' v-if="formData.order_status == 1 && formData.pay_status == 3 && formData.car_back_status ==-1">结束订单 </Button>
			</div>
		</Modal>

	</div>
</template>
<script>
	import {
		getInfo,
		getCarBackInfo,
		getZprice,
		endOrder,
		backCar
	} from '@/api/order'

	//import Editor from '_c/editor'
	//import Upload from '_c/common/upload'
	export default {
		components: {
			//  Editor,
			//  Upload
		},
		props: {
			modalId: {
				type: Number,
				default: 0
			}
		},
		created() {
			let t = this;
			if(this.modalId > 0) {
				this.getInfoById();
				this.getZprice();
			}
		},
		data() {
			let t = this;
			return {
				modalShow: true,
				saveLoading: false,
				hModal:false,
				formData: {
					order_sn:'',
					pay_status_text:'',
					car_sn:'',
					realname:'',
					username:'',
					car_brand_name:'',
					car_sys_name:'',
					car_type_name:'',
					car_sys_img:'',
					q_time:'',
					h_time:'',
					q_dot_name:'',
					h_dot_name:'',
					b_price:'',
					d_price:'',
					is_dis:'',
					b_money:'',
					is_dis_text:'',
					order_status:'',
					pay_status:'',
					car_back_status:'',
					dis_price:'',
					dis_address:''
							
				},
				zData:{
						z_price:'',
						day:'',
						hour:'',
						d_price:'',
						h_price:'',
						set_no_ded_price:'',
						dri_d_price:'',
						dri_h_price:'',
						is_dri:'',
						coupon:'',
						dis_price:'',
						distance:'',
						coupon:{
							price:0
						}
				},
				hData:{
					order_id:'',
					order_sn:'',
					dot_name:'',
					is_clean:-1,
					is_per:-1,
					is_nor:-1,
					back_car_type:''
				}
			}
		},
		methods: {
			getInfoById() {
				let t = this
				getInfo(t.modalId).then(res => {
					//console.log(res);
					if(res.data.code == 1){
						let res_data = res.data.data;
					    t.formData =  {
					    	order_id:res_data.order.order_id,
					    	order_sn:res_data.order.order_sn,
							pay_status_text:res_data.order.pay_status_text,
							car_sn:res_data.car.car_sn,
							realname:res_data.user.realname,
							username:res_data.user.username,
							car_brand_name:res_data.car.car_brand_name,
							car_sys_name:res_data.car.car_sys_name,
							car_type_name:res_data.car.car_type_name,
							car_sys_img:res_data.car.car_sys_img,
							q_time:res_data.order.q_time,
							h_time:res_data.order.h_time,
							q_dot_name:res_data.order.q_dot_name,
							h_dot_name:res_data.order.h_dot_name,
							b_price:res_data.car.b_price,
							d_price:res_data.order.d_price,
							is_dis:res_data.order.is_dis,
							b_money:res_data.user.b_money,
							is_dis_text:res_data.order.is_dis_text,
							order_status:res_data.order.order_status,
							pay_status:res_data.order.pay_status,
							car_back_status:res_data.order.car_back_status,
							dis_price:res_data.order.dis_price,
							dis_address:res_data.order.dis_address
						}
					    
					}else{
						t.$Notice.error({
							title: res.data.msg
						})
						this.$emit('on-edit-modal-hide')
						this.modalShow = false
					}
					
				})

			},
			
			getZprice() {
				let t = this
				getZprice(t.modalId).then(res => {
					//console.log(res);
					if(res.data.code == 1){
						let res_data = res.data.data;
						//console.log(res_data);
					    t.zData=  {
					    	z_price:res_data.z_price,
					    	day:res_data.day,
							hour:res_data.hour,
							d_price:res_data.d_price,
							h_price:res_data.h_price,
							set_no_ded_price:res_data.set_no_ded_price,
							dri_d_price:res_data.dri_d_price,
							dri_h_price:res_data.dri_h_price,
							is_dri:res_data.is_dri,
							coupon:res_data.coupon,
							distance:res_data.distance,
							dis_price:res_data.dis_price
						}
					}else{
						t.$Notice.error({
							title: res.data.msg
						})
						this.$emit('on-edit-modal-hide')
						this.modalShow = false
					}
					
				})

			},
			hc(back_car_type){
				let t = this;
				t.hModal = true;
				t.hData.order_id = t.formData.order_id;
				t.hData.back_car_type  = back_car_type;
				t.getCarBackInfo(t.hData.order_id,t.hData.back_car_type);
			},
			getCarBackInfo(order_id,back_car_type){
				let t = this;
				getCarBackInfo(order_id,back_car_type).then(res => {
//					console.log(back_car_type);return;
					if(res.data.code == 1){
						let res_data = res.data.data;
					    t.hData =  {
					    	order_id:order_id,
							order_sn:res_data.order_sn,
							dot_name:res_data.dot_name,
							is_clean:res_data.is_clean,
							is_per:res_data.is_per,
							is_nor:res_data.is_nor,
							back_car_type:back_car_type
						}
					    
					    //console.log(t.hData);
					    
					}else{
						t.$Notice.error({
							title: res.data.msg
						})
						this.$emit('on-edit-modal-hide')
						this.modalShow = false
					}
					
				})
			},
			hcModalOk(){
				let t =this;
				let formData = {
					order_id:t.hData.order_id,
					is_per:t.hData.is_per,
					is_clean:t.hData.is_clean,
					is_nor:t.hData.is_nor,
					back_car_type:t.hData.back_car_type
				}
				backCar(formData).then(res => {
							if(res.data.code == 1) {
								t.saveLoading = false
								t.modalShow = false
								t.$emit('on-edit-modal-success')
            					t.$emit('on-edit-modal-hide')
								t.$Notice.success({
									title: res.data.msg
								})
							} else {
								t.saveLoading = false
								t.$Notice.error({
									title: res.data.msg
								})
							}

						}, function(error) {
							t.saveLoading = false
						})
			},
			hcModalCancel(){
				let t = this;
				t.hData ={
					order_id:'',
					order_sn:'',
					dot_name:'',
					is_clean:-1,
					is_per:-1,
					is_nor:-1,
					back_car_type:''
				}
			},
			cancel() {
				this.$emit('on-edit-modal-hide')
				this.modalShow = false
			},
		
		},

	}
</script>